{% load static from staticfiles %}
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>插件使用</title>
    <link rel="stylesheet" href="{% static "layui/css/layui.css" %}" media="all">
<style>


</style>
</head>

<body>

        <div class="layui-tab layui-tab-card" style="margin-top:0px;">
                <ul class="layui-tab-title">
                      <li class="layui-this"><i class="layui-icon">&#xe68e;</i><span></span>插件使用</li>
                </ul>
            </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>插件使用</legend>
    </fieldset>
    <div class="layui-container" style="width:90%;">
        <form class="layui-form" action="" method="post">
            <div class="layui-form-item">
                <label class="layui-form-label">检测URL</label>
                <div class="layui-input-block">
                    <input type="text" id="domain" name="domain" lay-verify="required" autocomplete="off" placeholder="" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">搜索应用</label>
                <div class="layui-input-inline">
                    <select name="app_name" lay-verify="required" lay-filter="appsearch">
                      <option value="0" selected="selected">全部</option>
                     {%for i in appList%}
                      <option value="{{i.id}}">{{i.app_name}}</option>
                     {%endfor%}
                    </select>
                </div>
            </div>
        </form>
    </div>

    <div class="layui-container" style="width:95%;"> 
        <table id="demo" lay-filter="test"></table>
    </div>              
<script src="{% static "layui/layui.js"%}"></script>
<script>
    layui.use(['jquery','table','form','layer'], function() {
            var $ = layui.jquery,
            table=layui.table,
            form=layui.form,
            layer=layui.layer;

            table.render({
                elem: '#demo'
                ,url: '/plugin/pluginConfig_list' //数据接口
                ,page: true //开启分页
                ,cols: [[ //表头
                {field: 'id', title: 'ID',width:80}
                ,{field: 'plugin_name', title: '插件名称',width:300 }
                ,{field: 'plugin_content', title: '插件描述' }
                ,{field: 'plugin_version', title: '影响版本',width:100}
                ,{field: 'plugin_vultype', title: '漏洞类型',sort: true,width:180}
                ,{field: 'plugin_app_name', title: '应用类型',sort: true,width:150}
                ,{fixed: 'right', title:'操作', align:'center', toolbar: '#barDemo',width:100}
                ]]
            });


            function ityzl_SHOW_LOAD_LAYER(){
	   		    return layer.msg('正在检测...', {icon: 16,shade: [0.5, '#f5f5f5'],scrollbar: false,offset: 'auto', time:100000}) ;
            }
            function ityzl_CLOSE_LOAD_LAYER(index){
                layer.close(index);
            }



            table.on('tool(test)', function(obj){
                var data = obj.data;
                    if(obj.event === 'verify'){
                        var id = data.id;
                        var domain = $("#domain").val();
                        var jsonval={'id':id,'url':domain}
                        $.ajax({
                            type: "POST",
                            data: jsonval,
                            dataType:"json",
                            url: "/plugin/pluginVerify",
                            beforeSend: function () {
                                i = ityzl_SHOW_LOAD_LAYER();
                            },
                            success: function (msg) {
                                var data = msg.data;
                                var message2 = "";
                                if(data[0]=="1"){
                                    var message = "存在"+data[1];
                                    message2 = data[2];
                                }else if(data[0]=="0"){
                                    var message = "不存在"+data[1];
                                }else{
                                    var message = "检测目标为空";
                                }
                                ityzl_CLOSE_LOAD_LAYER(i);
                                layer.open({
                                    type: 1
                                    ,offset: 'auto'
                                    ,area:'500px'
                                    ,id: 'layerDemo' //防止重复弹出
                                    ,content: '<div style="padding: 20px 100px;">'+ message +'</br>'+message2+'</div>'
                                    ,btn: '关闭'
                                    ,btnAlign: 'c' //按钮居中
                                    ,shade: 0 //不显示遮罩
                                    ,yes: function(){
                                        layer.closeAll();
                                    }
                                });
                            }
                        });

                    } 
                
            });

            form.on('select(appsearch)', function(data){
                var app_id = data.value;
                table.reload('demo', { //表格的id
                        url:'/plugin/pluginShow_list',
                        where: {
                            'appid':$.trim(app_id)
                        },
                        page:{
                            curr:1,
                            limit:10
                        }
                });
            });  
    });

</script>       
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="verify">检测</a>
    
  </script>
</body>

</html>